

<!DOCTYPE html>
<html lang="zh-CN" data-default-color-scheme=auto>



<head>
  <meta charset="UTF-8">
  <link rel="apple-touch-icon" sizes="76x76" href="/img/bear.jpg">
  <link rel="icon" href="/img/bear.jpg">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, shrink-to-fit=no">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  
  <meta name="theme-color" content="#2f4154">
  <meta name="author" content="Wahoyu">
  <meta name="keywords" content="">
  
    <meta name="description" content="使用Servlet+Mybatis+Thymeleaf等框架与技术对控制台管理系统的进一步完善，使用Thymeleaf作为前端模板进行展示实现有效的前后端分离。">
<meta property="og:type" content="article">
<meta property="og:title" content="基于Java Web的图书管理系统">
<meta property="og:url" content="http://example.com/2022/07/06/JavaWeb/index.html">
<meta property="og:site_name" content="哆啦是个梦-A Coding Bear">
<meta property="og:description" content="使用Servlet+Mybatis+Thymeleaf等框架与技术对控制台管理系统的进一步完善，使用Thymeleaf作为前端模板进行展示实现有效的前后端分离。">
<meta property="og:locale" content="zh_CN">
<meta property="og:image" content="http://example.com/image/22.07.06/photo.png">
<meta property="article:published_time" content="2022-07-06T08:55:00.000Z">
<meta property="article:modified_time" content="2022-08-28T11:11:01.355Z">
<meta property="article:author" content="Wahoyu">
<meta property="article:tag" content="Java">
<meta property="article:tag" content="实战">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="http://example.com/image/22.07.06/photo.png">
  
  
    <meta name="referrer" content="no-referrer-when-downgrade">
  
  
  <title>基于Java Web的图书管理系统 - 哆啦是个梦-A Coding Bear</title>

  <link  rel="stylesheet" href="https://lib.baomitu.com/twitter-bootstrap/4.6.1/css/bootstrap.min.css" />



  <link  rel="stylesheet" href="https://lib.baomitu.com/github-markdown-css/4.0.0/github-markdown.min.css" />

  <link  rel="stylesheet" href="https://lib.baomitu.com/hint.css/2.7.0/hint.min.css" />

  <link  rel="stylesheet" href="https://lib.baomitu.com/fancybox/3.5.7/jquery.fancybox.min.css" />



<!-- 主题依赖的图标库，不要自行修改 -->
<!-- Do not modify the link that theme dependent icons -->

<link rel="stylesheet" href="//at.alicdn.com/t/font_1749284_hj8rtnfg7um.css">



<link rel="stylesheet" href="//at.alicdn.com/t/font_1736178_lbnruvf0jn.css">


<link  rel="stylesheet" href="/css/main.css" />


  <link id="highlight-css" rel="stylesheet" href="/css/highlight.css" />
  
    <link id="highlight-css-dark" rel="stylesheet" href="/css/highlight-dark.css" />
  



  
<link rel="stylesheet" href="//cdn.jsdelivr.net/gh/bynotes/texiao/source/css/shubiao.css#.css">



  <script id="fluid-configs">
    var Fluid = window.Fluid || {};
    Fluid.ctx = Object.assign({}, Fluid.ctx)
    var CONFIG = {"hostname":"example.com","root":"/","version":"1.9.0","typing":{"enable":true,"typeSpeed":90,"cursorChar":"_","loop":false,"scope":[]},"anchorjs":{"enable":true,"element":"h1,h2,h3,h4,h5,h6","placement":"left","visible":"hover","icon":""},"progressbar":{"enable":true,"height_px":3,"color":"#29d","options":{"showSpinner":false,"trickleSpeed":100}},"code_language":{"enable":true,"default":"TEXT"},"copy_btn":true,"image_caption":{"enable":true},"image_zoom":{"enable":true,"img_url_replace":["",""]},"toc":{"enable":true,"placement":"right","headingSelector":"h1,h2,h3,h4,h5,h6","collapseDepth":3},"lazyload":{"enable":true,"loading_img":"/img/loading.gif","onlypost":false,"offset_factor":2},"web_analytics":{"enable":true,"follow_dnt":true,"baidu":null,"google":null,"gtag":null,"tencent":{"sid":null,"cid":null},"woyaola":null,"cnzz":null,"leancloud":{"app_id":null,"app_key":null,"server_url":null,"path":"window.location.pathname","ignore_local":false}},"search_path":"/local-search.xml"};

    if (CONFIG.web_analytics.follow_dnt) {
      var dntVal = navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack;
      Fluid.ctx.dnt = dntVal && (dntVal.startsWith('1') || dntVal.startsWith('yes') || dntVal.startsWith('on'));
    }
  </script>
  <script  src="/js/utils.js" ></script>
  <script  src="/js/color-schema.js" ></script>

  
<meta name="generator" content="Hexo 6.2.0"></head>


<body>
  

  <header>
    

<div class="header-inner" style="height: 30vh;">
  <nav id="navbar" class="navbar fixed-top  navbar-expand-lg navbar-dark scrolling-navbar">
  <div class="container">
    <a class="navbar-brand" href="/">
      <strong>哆啦是个梦</strong>
    </a>

    <button id="navbar-toggler-btn" class="navbar-toggler" type="button" data-toggle="collapse"
            data-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <div class="animated-icon"><span></span><span></span><span></span></div>
    </button>

    <!-- Collapsible content -->
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
      <ul class="navbar-nav ml-auto text-center">
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/">
                <i class="iconfont icon-home-fill"></i>
                首页
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/archives/">
                <i class="iconfont icon-archive-fill"></i>
                归档
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/categories/">
                <i class="iconfont icon-category-fill"></i>
                分类
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/tags/">
                <i class="iconfont icon-tags-fill"></i>
                标签
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/about/">
                <i class="iconfont icon-user-fill"></i>
                关于
              </a>
            </li>
          
        
        
          <li class="nav-item" id="search-btn">
            <a class="nav-link" target="_self" href="javascript:;" data-toggle="modal" data-target="#modalSearch" aria-label="Search">
              &nbsp;<i class="iconfont icon-search"></i>&nbsp;
            </a>
          </li>
          
        
        
          <li class="nav-item" id="color-toggle-btn">
            <a class="nav-link" target="_self" href="javascript:;" aria-label="Color Toggle">&nbsp;<i
                class="iconfont icon-dark" id="color-toggle-icon"></i>&nbsp;</a>
          </li>
        
      </ul>
    </div>
  </div>
</nav>

  

<div id="banner" class="banner" parallax=true
     style="background: url('/img/default.png') no-repeat center center; background-size: cover;">
  <div class="full-bg-img">
    <div class="mask flex-center" style="background-color: rgba(0, 0, 0, 0.3)">
      <div class="banner-text text-center fade-in-up">
        <div class="h2">
          
            <span id="subtitle" data-typed-text="基于Java Web的图书管理系统"></span>
          
        </div>

        
          
  <div class="mt-3">
    
      <span class="post-meta mr-2">
        <i class="iconfont icon-author" aria-hidden="true"></i>
        Wahoyu
      </span>
    
    
      <span class="post-meta">
        <i class="iconfont icon-date-fill" aria-hidden="true"></i>
        <time datetime="2022-07-06 16:55" pubdate>
          2022年7月6日 下午
        </time>
      </span>
    
  </div>

  <div class="mt-1">
    
      <span class="post-meta mr-2">
        <i class="iconfont icon-chart"></i>
        
          29k 字
        
      </span>
    

    
      <span class="post-meta mr-2">
        <i class="iconfont icon-clock-fill"></i>
        
        
        
          241 分钟
        
      </span>
    

    
    
      
        <span id="busuanzi_container_page_pv" style="display: none">
          <i class="iconfont icon-eye" aria-hidden="true"></i>
          <span id="busuanzi_value_page_pv"></span> 次
        </span>
        
      
    
  </div>


        
      </div>

      
    </div>
  </div>
</div>

</div>

  </header>

  <main>
    
      

<div class="container-fluid nopadding-x">
  <div class="row nomargin-x">
    <div class="side-col d-none d-lg-block col-lg-2">
      
  <aside class="sidebar category-bar" style="margin-right: -1rem">
    





<div class="category-list">
  
  
    
    
    
    <div class="category row nomargin-x">
      <a class="category-item 
          list-group-item category-item-action col-10 col-md-11 col-xm-11" title="开发"
        id="heading-3ff3c3e26a68112c11c3e80f2a26896e" role="tab" data-toggle="collapse" href="#collapse-3ff3c3e26a68112c11c3e80f2a26896e"
        aria-expanded="true"
      >
        开发
        <span class="list-group-count">(9)</span>
        <i class="iconfont icon-arrowright"></i>
      </a>
      
      <div class="category-collapse collapse show" id="collapse-3ff3c3e26a68112c11c3e80f2a26896e"
           role="tabpanel" aria-labelledby="heading-3ff3c3e26a68112c11c3e80f2a26896e">
        
        
          
  <div class="category-post-list">
    
    
      
      
        <a href="/2022/06/05/SQL%E5%9F%BA%E7%A1%80%E8%AF%AD%E5%8F%A5%E6%97%A5%E5%B8%B8%E7%BB%83%E4%B9%A0/" title="SQL语句练习"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">SQL语句练习</span>
        </a>
      
    
      
      
        <a href="/2022/06/19/%E5%85%B3%E4%BA%8E%E5%8F%8D%E5%B0%84%E4%B8%8E%E6%B3%A8%E8%A7%A3%E7%9A%84%E7%90%86%E8%A7%A3%E4%B8%8E%E6%80%BB%E7%BB%93/" title="关于反射与注解的理解与总结"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">关于反射与注解的理解与总结</span>
        </a>
      
    
      
      
        <a href="/2022/07/06/JavaWeb/" title="基于Java Web的图书管理系统"
           class="list-group-item list-group-item-action
           active">
          <span class="category-post">基于Java Web的图书管理系统</span>
        </a>
      
    
      
      
        <a href="/2022/06/27/%E5%9F%BA%E4%BA%8EMybatis-JUL-Lombok-Maven%E7%9A%84%E5%9B%BE%E4%B9%A6%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F%EF%BC%88%E5%B8%A6%E5%8D%95%E5%85%83%E6%B5%8B%E8%AF%95%EF%BC%89/" title="基于Mybatis的图书管理系统"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">基于Mybatis的图书管理系统</span>
        </a>
      
    
      
      
        <a href="/2022/07/26/BookManagerSSM/" title="基于SSM+Security的图书管理系统"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">基于SSM+Security的图书管理系统</span>
        </a>
      
    
      
      
        <a href="/2022/06/10/%E7%AE%80%E5%8D%95%E7%AE%97%E6%B3%95%EF%BC%88Java%E5%AE%9E%E7%8E%B0%EF%BC%89/" title="排序与搜索算法（Java实现）"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">排序与搜索算法（Java实现）</span>
        </a>
      
    
      
      
        <a href="/2022/06/08/Java%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E7%AE%80%E5%8D%95%E5%AE%9E%E7%8E%B0/" title="数据结构实现（Java）"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">数据结构实现（Java）</span>
        </a>
      
    
      
      
        <a href="/2022/08/30/%E6%97%A5%E5%BF%97%E8%BF%9B%E5%8C%96%EF%BC%9AAOP+%E8%87%AA%E5%AE%9A%E4%B9%89%E6%B3%A8%E8%A7%A3%E5%AE%9E%E7%8E%B0%E6%97%A5%E5%BF%97%E8%BE%93%E5%87%BA/" title="日志进化：AOP+自定义注解实现日志输出"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">日志进化：AOP+自定义注解实现日志输出</span>
        </a>
      
    
      
      
        <a href="/2022/06/03/%E8%A7%A3%E5%86%B3Linux%E7%8E%AF%E5%A2%83%E5%8F%98%E9%87%8F%E6%AF%8F%E6%AC%A1%E8%A6%81source-etc-profile%E9%97%AE%E9%A2%98/" title="解决Linux环境变量每次要source /etc/profile问题"
           class="list-group-item list-group-item-action
           ">
          <span class="category-post">解决Linux环境变量每次要source /etc/profile问题</span>
        </a>
      
    
  </div>

        
      </div>
    </div>
  
</div>


  </aside>


    </div>

    <div class="col-lg-8 nopadding-x-md">
      <div class="container nopadding-x-md" id="board-ctn">
        <div id="board">
          <article class="post-content mx-auto">
            <!-- SEO header -->
            <h1 style="display: none">基于Java Web的图书管理系统</h1>
            
            <div class="markdown-body">
              
              <p>使用Servlet+Mybatis+Thymeleaf等框架与技术对控制台管理系统的进一步完善，使用Thymeleaf作为前端模板进行展示实现有效的前后端分离。</p>
<span id="more"></span>
<h2 id="项目成果展示"><a href="#项目成果展示" class="headerlink" title="项目成果展示"></a>项目成果展示</h2><p><img src="/image/22.07.06/shifan1.jpg" srcset="/img/loading.gif" lazyload></p>
<p><img src="/image/22.07.06/shifan2.jpg" srcset="/img/loading.gif" lazyload></p>
<h2 id="项目分析"><a href="#项目分析" class="headerlink" title="项目分析"></a>项目分析</h2><h3 id="项目需求"><a href="#项目需求" class="headerlink" title="项目需求"></a>项目需求</h3><ul>
<li><p><input checked="" disabled="" type="checkbox"> 
图书管理员的登陆、权限校验、拦截</p>
</li>
<li><p><input checked="" disabled="" type="checkbox"> 
用户退出</p>
</li>
<li><p><input checked="" disabled="" type="checkbox"> 
图书的列表浏览（包括书籍是否被借出的状态也要进行显示）</p>
</li>
<li><p><input checked="" disabled="" type="checkbox"> 
学生的列表浏览</p>
</li>
<li><p><input checked="" disabled="" type="checkbox"> 
查看所有的借阅列表</p>
</li>
<li><p><input checked="" disabled="" type="checkbox"> 
添加借阅信息</p>
</li>
<li><p><input checked="" disabled="" type="checkbox"> 
图书的添加和删除</p>
</li>
<li><p><input checked="" disabled="" type="checkbox"> 
学生的添加和删除</p>
</li>
</ul>
<h3 id="框架结构分析"><a href="#框架结构分析" class="headerlink" title="框架结构分析"></a>框架结构分析</h3><p>本次实战使用到的框架：Servlet+Mybatis+Thymeleaf</p>
<p>在编写的时候，为了使得整体的代码简洁高效，我们严格遵守三层架构模式：</p>
<p><img src="https://www.runoob.com/wp-content/uploads/2018/08/1535337833-4838-1359192395-1143.png" srcset="/img/loading.gif" lazyload></p>
<p>**表示层(前端页面+Servlet)**：Servlet向service层索要数据，接收前端页面的请求（发送页面解析）与响应（上下文）</p>
<p>**业务逻辑层(Service+ServiceImpl)**：才是用于进行数据处理的地方。逻辑层通过mapper索要数据，向servlet反应数据。</p>
<p><strong>数据访问层（Mybatis+mapper）</strong>：数据访问层向下管数据库索要数据，向上为Service提供接口方法。</p>
<p><strong>实体类</strong>：实体类贯穿三大层次，将数据封装在实体类中，以便于数据在三层架构中进行数据传递。</p>
<h3 id="关于Thymeleaf"><a href="#关于Thymeleaf" class="headerlink" title="关于Thymeleaf"></a>关于Thymeleaf</h3><p>使用Thymeleaf可以有效地避免前后端耦合的情况，不过由于并没有Spring配置文件可以调整Thymeleaf的编码，项目的编码问题一直都在servlet和html中进行调配解决，在全局项目和当前项目都设置为utf-8之后，将html(thymeleaf编码设置为gbk)，并在servlet需要的方法中（doGet或者doPost中进行编码设置）可以使中文不会乱码。</p>
<p>前端模板如下：</p>
<p><a href="file/SplashDash_ZSnPE0iiz_.7z">SplashDash.7z</a></p>
<h2 id="Login页面的搭建以及相关配置"><a href="#Login页面的搭建以及相关配置" class="headerlink" title="Login页面的搭建以及相关配置"></a>Login页面的搭建以及相关配置</h2><p>此处进行数据库表格的搭建、创建项目环境、进行Login页面的简单进入。</p>
<h3 id="数据库"><a href="#数据库" class="headerlink" title="数据库"></a>数据库</h3><h4 id="创建admin表并插入数据"><a href="#创建admin表并插入数据" class="headerlink" title="创建admin表并插入数据"></a>创建admin表并插入数据</h4><p><img src="/image/22.07.06/image_OBZKWh9UWr.png" srcset="/img/loading.gif" lazyload></p>
<p><img src="/image/22.07.06/image_3lzQw7bc_o.png" srcset="/img/loading.gif" lazyload></p>
<h3 id="新建项目BookManagerWeb"><a href="#新建项目BookManagerWeb" class="headerlink" title="新建项目BookManagerWeb"></a>新建项目BookManagerWeb</h3><p><img src="/image/22.07.06/image_GnQxHLJYWI.png" srcset="/img/loading.gif" lazyload></p>
<p><img src="/image/22.07.06/image_nrQCuQ1psE.png" srcset="/img/loading.gif" lazyload></p>
<p>清空自带的文件</p>
<p><img src="/image/22.07.06/image_aSmJiQ-T2U.png" srcset="/img/loading.gif" lazyload></p>
<h3 id="添加Maven依赖和插件"><a href="#添加Maven依赖和插件" class="headerlink" title="添加Maven依赖和插件"></a>添加Maven依赖和插件</h3><p>①如果是Tomcat10以上的版本要修改servlet</p>
<p>②添加lombok，junit5，jdbc，mybaits</p>
<figure class="highlight xml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br></pre></td><td class="code"><pre><code class="hljs xml"><span class="hljs-comment">&lt;!--Lombok--&gt;</span><br>  <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.projectlombok<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>lombok<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>1.18.22<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">scope</span>&gt;</span>provided<span class="hljs-tag">&lt;/<span class="hljs-name">scope</span>&gt;</span><br>  <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span><br><br>  <span class="hljs-comment">&lt;!--JDBC--&gt;</span><br>  <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>mysql<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>mysql-connector-java<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>8.0.27<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span><br>  <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span><br>  <br>  <span class="hljs-comment">&lt;!--Mybatis--&gt;</span><br>  <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.mybatis<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>mybatis<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span><br>      <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>3.5.7<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span><br>  <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span><br><br></code></pre></td></tr></table></figure>

<p>③Maven构建</p>
<h3 id="导入login页面和static资源"><a href="#导入login页面和static资源" class="headerlink" title="导入login页面和static资源"></a>导入login页面和static资源</h3><p>加上thymeleaf约束</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs html">xmlns:th=&quot;http://www.thymeleaf.org&quot;<br></code></pre></td></tr></table></figure>

<p><img src="/image/22.07.06/image_85j3ZuwKSv.png" srcset="/img/loading.gif" lazyload></p>
<blockquote>
<p>问题：为什么login.html文件放在resources文件夹？</p>
<p>答案：因为login页面需要被Thymeleaf进行动态解析</p>
</blockquote>
<h3 id="创建Servlet文件夹以及LoginServlet"><a href="#创建Servlet文件夹以及LoginServlet" class="headerlink" title="创建Servlet文件夹以及LoginServlet"></a>创建Servlet文件夹以及LoginServlet</h3><p><img src="/image/22.07.06/image_flKqCoBYFH.png" srcset="/img/loading.gif" lazyload></p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebFilter(&quot;/login&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">LoginServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br><br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        ThymeleafUtil.process(<span class="hljs-string">&quot;login.html&quot;</span>,<span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>(),resp.getWriter());<br>    &#125;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h3 id="修改Tomcat默认url和部署路径"><a href="#修改Tomcat默认url和部署路径" class="headerlink" title="修改Tomcat默认url和部署路径"></a>修改Tomcat默认url和部署路径</h3><p><img src="/image/22.07.06/image_-KXgxZq4zp.png" srcset="/img/loading.gif" lazyload></p>
<p><img src="/image/22.07.06/image_J112XgIKPM.png" srcset="/img/loading.gif" lazyload></p>
<h3 id="创建工具类文件夹以及Thymeleaf工具类"><a href="#创建工具类文件夹以及Thymeleaf工具类" class="headerlink" title="创建工具类文件夹以及Thymeleaf工具类"></a>创建工具类文件夹以及Thymeleaf工具类</h3><p>对调用的工具类方法进行优化</p>
<p>原代码</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">ThymeleafUtil</span> &#123;<br><br>    <span class="hljs-keyword">private</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">final</span> TemplateEngine engine;<br>    <span class="hljs-keyword">static</span>  &#123;<br>        engine = <span class="hljs-keyword">new</span> <span class="hljs-title class_">TemplateEngine</span>();<br>        <span class="hljs-type">ClassLoaderTemplateResolver</span> <span class="hljs-variable">r</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">ClassLoaderTemplateResolver</span>();<br>        engine.setTemplateResolver(r);<br>    &#125;<br><br>    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> TemplateEngine <span class="hljs-title function_">getEngine</span><span class="hljs-params">()</span> &#123;<br>        <span class="hljs-keyword">return</span> engine;<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<p>优化后节省了传值的过程</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">ThymeleafUtil</span> &#123;<br><br>    <span class="hljs-keyword">private</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">final</span> TemplateEngine engine;<br>    <span class="hljs-keyword">static</span>  &#123;<br>        engine = <span class="hljs-keyword">new</span> <span class="hljs-title class_">TemplateEngine</span>();<br>        <span class="hljs-type">ClassLoaderTemplateResolver</span> <span class="hljs-variable">r</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">ClassLoaderTemplateResolver</span>();<br>        engine.setTemplateResolver(r);<br>    &#125;<br>    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">process</span><span class="hljs-params">(String template, IContext context, Writer writer)</span>&#123;<br>        engine.process(template, context, writer);<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="进行运行试验"><a href="#进行运行试验" class="headerlink" title="进行运行试验"></a>进行运行试验</h3><blockquote>
<p>报错：至少有一个JAR被扫描用于TLD但尚未包含TLD。一个或多个筛选器启动失败</p>
<p>解决：<code>@WebServlet</code>错写成了<code>@WebFilter</code>，改回去就好了（查了三小时，裂开）</p>
<p>成功的Servlet</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebServlet(&quot;/login&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">LoginServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br><br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>        <span class="hljs-comment">//设置编码</span><br>        req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>        ThymeleafUtil.getEngine().process(<span class="hljs-string">&quot;login.html&quot;</span>, context, resp.getWriter());<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<p>失败的Servlet</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebFilter(&quot;/login&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">LoginServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br><br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        ThymeleafUtil.process(<span class="hljs-string">&quot;login.html&quot;</span>,<span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>(),resp.getWriter());<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>
</blockquote>
<h2 id="登陆权限的设置"><a href="#登陆权限的设置" class="headerlink" title="登陆权限的设置"></a>登陆权限的设置</h2><p>在此处我们要设置登陆权限的控制（验证身份）。在设置了全局过滤器的情况下，只能通过提交用户密码进行登录。对表单中的数据进行收集，通过doPost方法进行提交之后，servlet调用ServiceImpl方法进行验证，如果true则输出LoginSuccess。ServiceImpl属于实现Service，Service调用Mapper中的方法，Mapper链接Mybatis可以对数据库进行操作。</p>
<h3 id="设置Servlet字符编码"><a href="#设置Servlet字符编码" class="headerlink" title="设置Servlet字符编码"></a>设置Servlet字符编码</h3><p>html不设置gbk会出现中文乱码，Servlet不设置req resp为utf-8会显示问号</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//设置编码</span><br>req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br></code></pre></td></tr></table></figure>

<h3 id="设置表单和LoginServlet的doPOST"><a href="#设置表单和LoginServlet的doPOST" class="headerlink" title="设置表单和LoginServlet的doPOST"></a>设置表单和LoginServlet的doPOST</h3><p>给Form加上method   action   修改username password remember-me button</p>
<p>给username和password加上name</p>
<p><img src="/image/22.07.06/image_7wKsp5l5uW.png" srcset="/img/loading.gif" lazyload></p>
<p><img src="/image/22.07.06/image_LWObiFgZst.png" srcset="/img/loading.gif" lazyload></p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">button</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;ad-btn ad-login-member&quot;</span>&gt;</span>登录<span class="hljs-tag">&lt;/<span class="hljs-name">button</span>&gt;</span><br></code></pre></td></tr></table></figure>

<p>doPost</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doPost</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>    <br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="先设置过滤器"><a href="#先设置过滤器" class="headerlink" title="先设置过滤器"></a>先设置过滤器</h3><p>①可以让你访问静态资源</p>
<p>②不是静态资源就要验证登录</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebFilter(&quot;/*&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">MainFilter</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpFilter</span> &#123;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doFilter</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse res, FilterChain chain)</span> <span class="hljs-keyword">throws</span> IOException, ServletException &#123;<br>        <span class="hljs-type">String</span> <span class="hljs-variable">url</span> <span class="hljs-operator">=</span> req.getRequestURL().toString();<br>        <span class="hljs-comment">//判断是否为静态资源,如果是静态资源就放行。如果不是，并且没登陆，那就得回去登陆了。</span><br>        <span class="hljs-comment">//如果不是静态资源，user还是空，您登陆的不是login,你就得去登陆</span><br>        <span class="hljs-comment">//其他情况都给你钥匙</span><br>        <span class="hljs-keyword">if</span>(!url.contains(<span class="hljs-string">&quot;/static/&quot;</span>)&amp;&amp;!url.endsWith(<span class="hljs-string">&quot;login&quot;</span>))&#123;<br>            <span class="hljs-comment">//验证登录</span><br>        &#125;<br>        <span class="hljs-comment">//交给过滤链处理</span><br>        chain.doFilter(req, res);<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="设置User实体类"><a href="#设置User实体类" class="headerlink" title="设置User实体类"></a>设置User实体类</h3><p>以进行数值查询与比对</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@Data</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">User</span> &#123;<br>    <span class="hljs-type">int</span> id;<br>    String username;<br>    String nickname;<br>    String password;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="完善Filter中的判断语句"><a href="#完善Filter中的判断语句" class="headerlink" title="完善Filter中的判断语句"></a>完善Filter中的判断语句</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-keyword">if</span>(!url.contains(<span class="hljs-string">&quot;/static/&quot;</span>)&amp;&amp;!url.endsWith(<span class="hljs-string">&quot;login&quot;</span>))&#123;<br>            <span class="hljs-type">HttpSession</span> <span class="hljs-variable">session</span> <span class="hljs-operator">=</span> req.getSession();<br>            <span class="hljs-type">User</span> <span class="hljs-variable">user</span> <span class="hljs-operator">=</span> (User) session.getAttribute(<span class="hljs-string">&quot;user&quot;</span>);<br>            <span class="hljs-comment">//判断是否未登陆</span><br>            <span class="hljs-keyword">if</span>(user == <span class="hljs-literal">null</span> &amp;&amp; !url.endsWith(<span class="hljs-string">&quot;login&quot;</span>))&#123;<br>                res.sendRedirect(<span class="hljs-string">&quot;login&quot;</span>);<br>                <span class="hljs-keyword">return</span>;<br>            &#125;<br>        &#125;<br>        <span class="hljs-comment">//交给过滤链处理</span><br>        chain.doFilter(req, res);<br></code></pre></td></tr></table></figure>

<p>此验证的是登录成功之后，LoginServlet给你的user值，主要对比数据库还是在LoginServlet中</p>
<blockquote>
<p>问题：为什么允许静态变量进行访问呢？</p>
<p>答：因为主页的一些js,css都是属于静态变量中的一个部分。不允许访问主页会显示乱码。</p>
</blockquote>
<h3 id="配置Mybatis"><a href="#配置Mybatis" class="headerlink" title="配置Mybatis"></a>配置Mybatis</h3><figure class="highlight xml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br></pre></td><td class="code"><pre><code class="hljs xml"><span class="hljs-meta">&lt;?xml version=<span class="hljs-string">&quot;1.0&quot;</span> encoding=<span class="hljs-string">&quot;UTF-8&quot;</span> ?&gt;</span><br><span class="hljs-meta">&lt;!DOCTYPE <span class="hljs-keyword">configuration</span></span><br><span class="hljs-meta">        <span class="hljs-keyword">PUBLIC</span> <span class="hljs-string">&quot;-//mybatis.org//DTD Config 3.0//EN&quot;</span></span><br><span class="hljs-meta">        <span class="hljs-string">&quot;http://mybatis.org/dtd/mybatis-3-config.dtd&quot;</span>&gt;</span><br><span class="hljs-tag">&lt;<span class="hljs-name">configuration</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">environments</span> <span class="hljs-attr">default</span>=<span class="hljs-string">&quot;development&quot;</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">environment</span> <span class="hljs-attr">id</span>=<span class="hljs-string">&quot;development&quot;</span>&gt;</span><br>            <span class="hljs-tag">&lt;<span class="hljs-name">transactionManager</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;JDBC&quot;</span>/&gt;</span><br>            <span class="hljs-tag">&lt;<span class="hljs-name">dataSource</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;POOLED&quot;</span>&gt;</span><br>                <span class="hljs-tag">&lt;<span class="hljs-name">property</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;driver&quot;</span> <span class="hljs-attr">value</span>=<span class="hljs-string">&quot;com.mysql.cj.jdbc.Driver&quot;</span>/&gt;</span><br>                <span class="hljs-tag">&lt;<span class="hljs-name">property</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;url&quot;</span> <span class="hljs-attr">value</span>=<span class="hljs-string">&quot;jdbc:mysql://localhost:3306/book_manage&quot;</span>/&gt;</span><br>                <span class="hljs-tag">&lt;<span class="hljs-name">property</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;username&quot;</span> <span class="hljs-attr">value</span>=<span class="hljs-string">&quot;root&quot;</span>/&gt;</span><br>                <span class="hljs-tag">&lt;<span class="hljs-name">property</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;password&quot;</span> <span class="hljs-attr">value</span>=<span class="hljs-string">&quot;123456&quot;</span>/&gt;</span><br>            <span class="hljs-tag">&lt;/<span class="hljs-name">dataSource</span>&gt;</span><br>        <span class="hljs-tag">&lt;/<span class="hljs-name">environment</span>&gt;</span><br>    <span class="hljs-tag">&lt;/<span class="hljs-name">environments</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">mappers</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">package</span> <span class="hljs-attr">name</span> = <span class="hljs-string">&quot;com.book.dao&quot;</span>/&gt;</span><br>    <span class="hljs-tag">&lt;/<span class="hljs-name">mappers</span>&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">configuration</span>&gt;</span><br></code></pre></td></tr></table></figure>

<h3 id="配置了Mybatis当然要写Mapper接口-操作数据库的这一层"><a href="#配置了Mybatis当然要写Mapper接口-操作数据库的这一层" class="headerlink" title="配置了Mybatis当然要写Mapper接口(操作数据库的这一层)"></a>配置了Mybatis当然要写Mapper接口(操作数据库的这一层)</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-keyword">public</span> <span class="hljs-keyword">interface</span> <span class="hljs-title class_">UserMapper</span> &#123;<br>    <br>    <span class="hljs-meta">@Select(&quot;select * from admin where username = #&#123;username&#125; and password = #&#123;password&#125;&quot;)</span><br>    User <span class="hljs-title function_">getUser</span><span class="hljs-params">(<span class="hljs-meta">@Param(&quot;username&quot;)</span> String username,<span class="hljs-meta">@Param(&quot;password&quot;)</span> String password)</span>;<br>        <br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="Mybatis工具类"><a href="#Mybatis工具类" class="headerlink" title="Mybatis工具类"></a>Mybatis工具类</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">MybatisUtil</span> &#123;<br>    <span class="hljs-keyword">private</span> <span class="hljs-keyword">static</span> SqlSessionFactory factory;<br>    <span class="hljs-keyword">static</span> &#123;<br>        <span class="hljs-keyword">try</span> &#123;<br>            factory = <span class="hljs-keyword">new</span> <span class="hljs-title class_">SqlSessionFactoryBuilder</span>().build(Resources.getResourceAsReader(<span class="hljs-string">&quot;mybatis-config.xml&quot;</span>));<br>        &#125; <span class="hljs-keyword">catch</span> (IOException e) &#123;<br>            e.printStackTrace();<br>        &#125;<br>    &#125;<br>    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> SqlSession <span class="hljs-title function_">getSession</span><span class="hljs-params">()</span>&#123;<br>        <span class="hljs-keyword">return</span> factory.openSession(<span class="hljs-literal">true</span>);<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="业务逻辑层Service"><a href="#业务逻辑层Service" class="headerlink" title="业务逻辑层Service"></a>业务逻辑层Service</h3><p>(用于判断数据库中有没有用户名加密码，如果有就丢一个Session，原来是在Servlet,详情查看WebTest项目)</p>
<p>写UserService接口，在impl(implement实现)里面写上接口的实现类</p>
<p>我们验证结束后丢给Session,丢个User对象</p>
<p><img src="/image/22.07.06/image_x_TmOZByLy.png" srcset="/img/loading.gif" lazyload></p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//UserService</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">interface</span> <span class="hljs-title class_">UserService</span> &#123;<br>    <span class="hljs-type">boolean</span> <span class="hljs-title function_">auth</span><span class="hljs-params">(String username, String password, HttpSession session)</span>;<br>&#125;<br><br><br></code></pre></td></tr></table></figure>

<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//UserServiceImpl</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">UserServiceImpl</span> <span class="hljs-keyword">implements</span> <span class="hljs-title class_">UserService</span> &#123;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">public</span> <span class="hljs-type">boolean</span> <span class="hljs-title function_">auth</span><span class="hljs-params">(String username, String password, HttpSession session)</span> &#123;<br>        <span class="hljs-keyword">try</span>(<span class="hljs-type">SqlSession</span> <span class="hljs-variable">sqlsession</span> <span class="hljs-operator">=</span> MybatisUtil.getSession())&#123;<br>            <span class="hljs-type">UserMapper</span> <span class="hljs-variable">mapper</span> <span class="hljs-operator">=</span> sqlsession.getMapper(UserMapper.class);<br>            <span class="hljs-type">User</span> <span class="hljs-variable">user</span> <span class="hljs-operator">=</span> mapper.getUser(username,password);<br>            <span class="hljs-keyword">if</span>(user == <span class="hljs-literal">null</span>)&#123;<br>                <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;<br>            &#125;<span class="hljs-keyword">else</span>&#123;<br>                session.setAttribute(<span class="hljs-string">&quot;user&quot;</span>,user);<br>                <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;<br>            &#125;<br>        &#125;<br>    &#125;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h3 id="LoginServlet的init和Post完善"><a href="#LoginServlet的init和Post完善" class="headerlink" title="LoginServlet的init和Post完善"></a>LoginServlet的init和Post完善</h3><p>对表单提交，以及登陆错误显示失败的逻辑进行完善</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebServlet(&quot;/login&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">LoginServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br><br>    UserService service;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">init</span><span class="hljs-params">()</span> <span class="hljs-keyword">throws</span> ServletException &#123;<br>        service = <span class="hljs-keyword">new</span> <span class="hljs-title class_">UserServiceImpl</span>();<br>    &#125;<br><br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//设置编码</span><br>        req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>        <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>        <span class="hljs-keyword">if</span>(req.getSession().getAttribute(<span class="hljs-string">&quot;login-failure&quot;</span>)!=<span class="hljs-literal">null</span>)&#123;<br>            context.setVariable(<span class="hljs-string">&quot;failure&quot;</span>,<span class="hljs-literal">true</span>);<br>            req.getSession().removeAttribute(<span class="hljs-string">&quot;login-failure&quot;</span>);<br>        &#125;<br>        ThymeleafUtil.process(<span class="hljs-string">&quot;login.html&quot;</span>,context,resp.getWriter());<br>    &#125;<br><br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doPost</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-type">String</span> <span class="hljs-variable">username</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;username&quot;</span>);<br>        <span class="hljs-type">String</span> <span class="hljs-variable">password</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;password&quot;</span>);<br>        <span class="hljs-type">String</span> <span class="hljs-variable">remember</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;remember&quot;</span>);<br>        <span class="hljs-keyword">if</span>(service.auth(username,password,req.getSession()))&#123;<br>            resp.getWriter().write(<span class="hljs-string">&quot;Login Success!&quot;</span>);<br>        &#125;<span class="hljs-keyword">else</span>&#123;<br>            req.getSession().setAttribute(<span class="hljs-string">&quot;login-failure&quot;</span>,<span class="hljs-keyword">new</span> <span class="hljs-title class_">Object</span>());<br>            <span class="hljs-built_in">this</span>.doGet(req,resp);<br>        &#125;<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="在Login-html加上if判断"><a href="#在Login-html加上if判断" class="headerlink" title="在Login.html加上if判断"></a>在Login.html加上if判断</h3><figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">p</span> <span class="hljs-attr">th:unless</span>=<span class="hljs-string">&quot;$&#123;failure&#125;&quot;</span>&gt;</span>请输出用户名和密码进行登陆<span class="hljs-tag">&lt;/<span class="hljs-name">p</span>&gt;</span><br><span class="hljs-tag">&lt;<span class="hljs-name">p</span> <span class="hljs-attr">th:if</span>=<span class="hljs-string">&quot;$&#123;failure&#125;&quot;</span> <span class="hljs-attr">style</span>=<span class="hljs-string">&quot;color:red&quot;</span>&gt;</span>您的用户名或密码输入不正确<span class="hljs-tag">&lt;/<span class="hljs-name">p</span>&gt;</span><br></code></pre></td></tr></table></figure>

<h3 id="将Mapper文件加改名成了dao"><a href="#将Mapper文件加改名成了dao" class="headerlink" title="将Mapper文件加改名成了dao"></a>将Mapper文件加改名成了dao</h3><h3 id="登录测试"><a href="#登录测试" class="headerlink" title="登录测试"></a>登录测试</h3><p><img src="/image/22.07.06/image_sd--Ze1IH_.png" srcset="/img/loading.gif" lazyload></p>
<blockquote>
<p>报错：点了登录键没有效果</p>
<p>答：登录键没有改成button，并且设置了<code>JavaScript：void(0);</code>意思是不让人点。</p>
<p><img src="/image/22.07.06/image_DTpWoQYY9K.png" srcset="/img/loading.gif" lazyload></p>
<p>改成</p>
<p><img src="/image/22.07.06/image_0PwOr-uLeP.png" srcset="/img/loading.gif" lazyload></p>
</blockquote>
<h3 id="流程回顾"><a href="#流程回顾" class="headerlink" title="流程回顾"></a>流程回顾</h3><p>①用户输入的数据通过前端表单，到Servlet的doPost，使用Service的方法，Service使用Mapper定义的映射规则进行查询user对象，返回一个true或者false &amp;#x20;<br>②如果验证成功Servlet显示下一个页面 &amp;#x20;<br>③如果失败，会带着失败属性跳转到doGet请求，然后通过前端的if判断显示登陆失败。</p>
<h2 id="其他主要页面的搭建-退出功能"><a href="#其他主要页面的搭建-退出功能" class="headerlink" title="其他主要页面的搭建+退出功能"></a>其他主要页面的搭建+退出功能</h2><p>配置了其他页面的前端链接并对对应的链接编写了Servlet与之对应，并添加了退出逻辑。之前登录的之后，之所以可以全局页面进行浏览就是因为我们的请求中携带了session在Cookie中，退出逻辑正是对session进行清除并对主页进行重定向，所有的页面访问都会一并消失。</p>
<h3 id="添加页面测试"><a href="#添加页面测试" class="headerlink" title="添加页面测试"></a>添加页面测试</h3><p>插入index.html（框架支持和gbk）</p>
<p>IndexServlet以及doGet</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebServlet(&quot;/index&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">IndexServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//设置编码</span><br>        req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>        <span class="hljs-comment">//创建一个上下文对象</span><br>        <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>        <span class="hljs-comment">//内容修改</span><br>        <span class="hljs-comment">//获取username放在页面右上角</span><br>        <span class="hljs-type">User</span> <span class="hljs-variable">user</span> <span class="hljs-operator">=</span> (User) req.getSession().getAttribute(<span class="hljs-string">&quot;user&quot;</span>);<br>        context.setVariable(<span class="hljs-string">&quot;nickname&quot;</span>,user.getNickname());<br>        <span class="hljs-comment">//提交修改</span><br>        ThymeleafUtil.process(<span class="hljs-string">&quot;index.html&quot;</span>,context,resp.getWriter());<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<p>登陆成功（Login-doPost）直接重定向，已经登陆的(Login-doGet)请求登陆页面也重定向</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doPost</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//取得表单中的用户信息</span><br>        <span class="hljs-type">String</span> <span class="hljs-variable">username</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;username&quot;</span>);<br>        <span class="hljs-type">String</span> <span class="hljs-variable">password</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;password&quot;</span>);<br>        <span class="hljs-type">String</span> <span class="hljs-variable">remember</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;remember-me&quot;</span>);<br>        <span class="hljs-comment">//采用Service中的逻辑语句进行比对</span><br>        <span class="hljs-comment">// 如果true则重定向到index</span><br>        <span class="hljs-keyword">if</span>(service.auth(username,password,req.getSession()))&#123;<br>            resp.sendRedirect(<span class="hljs-string">&quot;index&quot;</span>);<br>        &#125;<br>        <span class="hljs-comment">//如果false则滚去重新进行登陆页面</span><br>        <span class="hljs-keyword">else</span>&#123;<br>            req.getSession().setAttribute(<span class="hljs-string">&quot;login-failure&quot;</span>,<span class="hljs-keyword">new</span> <span class="hljs-title class_">Object</span>());<br>            <span class="hljs-built_in">this</span>.doGet(req,resp);<br>        &#125;<br>    &#125;<br></code></pre></td></tr></table></figure>

<p>进行测试是否可以正常打开</p>
<blockquote>
<p><strong>报错：加了页面之后还是没有，报错500</strong></p>
<p>解决：可以通过Maven-clean解决，如果clean之后还是报错再看程序问题</p>
</blockquote>
<h3 id="左侧面板设计"><a href="#左侧面板设计" class="headerlink" title="左侧面板设计"></a>左侧面板设计</h3><p>借阅信息（index）</p>
<p>图书列表浏览（books）</p>
<p>学生列表(students)</p>
<p><img src="/image/22.07.06/image_m3nxICxT6k.png" srcset="/img/loading.gif" lazyload></p>
<h3 id="退出登录操作"><a href="#退出登录操作" class="headerlink" title="退出登录操作"></a>退出登录操作</h3><p>新建LogoutServlet，顺便整理Servlet包为不同的Servlet进行随意分类</p>
<p>如果有人想退出就请求logout，链接到LogoutServlet，servlet负责清除session以及重定向到主页</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//LogoutSservlet</span><br><span class="hljs-meta">@WebServlet(&quot;/logout&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">LogoutServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//清除session</span><br>        req.getSession().removeAttribute(<span class="hljs-string">&quot;user&quot;</span>);<br>        <span class="hljs-comment">//重定向</span><br>        resp.sendRedirect(<span class="hljs-string">&quot;login&quot;</span>);<br>    &#125;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h3 id="index页面修改"><a href="#index页面修改" class="headerlink" title="index页面修改"></a>index页面修改</h3><p>删除不要的东西(收缩)</p>
<p>对应修改的内容放在Thymeleaf-doGet里面做替换</p>
<p>删除后可以建立Thymeleaf模板header.html，创建链接，主页面进行使用</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">header</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;header-wrapper main-header&quot;</span> <span class="hljs-attr">th:fragment</span>=<span class="hljs-string">&quot;title&quot;</span>&gt;</span><br></code></pre></td></tr></table></figure>

<p>对应的模板使用</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-comment">&lt;!-- 头部菜单栏引用模板header.html --&gt;</span><br><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">th:replace</span>=<span class="hljs-string">&quot;header.html::title&quot;</span>&gt;</span> <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br></code></pre></td></tr></table></figure>

<h3 id="添加Students和Books页面"><a href="#添加Students和Books页面" class="headerlink" title="添加Students和Books页面"></a>添加Students和Books页面</h3><p>简单配置好两个页面的html文件（从index复制过来进行修改）和对应的Servlet文件（对页面的主体内容进行修改）</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//BookServlet</span><br><span class="hljs-meta">@WebServlet(&quot;/books&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">BookServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//设置编码</span><br>        req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>        <span class="hljs-comment">//创建一个上下文对象</span><br>        <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>        <span class="hljs-comment">//提交修改</span><br>        ThymeleafUtil.process(<span class="hljs-string">&quot;books.html&quot;</span>,context,resp.getWriter());<br>    &#125;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//StudentServlet</span><br><span class="hljs-meta">@WebServlet(&quot;/students&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">StudentServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//设置编码</span><br>        req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>        <span class="hljs-comment">//创建一个上下文对象</span><br>        <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>        <span class="hljs-comment">//提交修改</span><br>        ThymeleafUtil.process(<span class="hljs-string">&quot;students.html&quot;</span>,context,resp.getWriter());<br>    &#125;<br>&#125;<br><br><br></code></pre></td></tr></table></figure>

<h3 id="进行测试"><a href="#进行测试" class="headerlink" title="进行测试"></a>进行测试</h3><blockquote>
<p><strong>报错：BookServlet中的url链接错误</strong></p>
<p>解决：原因是Book中的@WebServlet(“”)中的book前没加斜杠</p>
</blockquote>
<h2 id="查询借阅信息"><a href="#查询借阅信息" class="headerlink" title="查询借阅信息"></a>查询借阅信息</h2><h3 id="思路"><a href="#思路" class="headerlink" title="思路"></a>思路</h3><p>我们要在删除和添加操作前面做查询操作，因为添加和删除操作没有设置返回值，成功与否都是查询进行反馈。首先实现的是借阅的信息，借阅信息通过mapper的联查语句对数据库进行操作（小知识，联查语句可以提前在可视化工具进行实验，避免之后发生问题），与添加和删除不同的是，查询运用到了集合类，将serviceimpl查到的结果列表整个返回给Servlet，Servlet也将整个列表返回给Thymeleaf，因为Thymeleaf可以自己解析列表，通过前端语句进行输出。</p>
<h3 id="Mapper按包注册"><a href="#Mapper按包注册" class="headerlink" title="Mapper按包注册"></a>Mapper按包注册</h3><p>修改mybatis的mapper注册，修改为一个包</p>
<figure class="highlight xml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs xml"><span class="hljs-comment">&lt;!--mapper注册--&gt;</span><br><span class="hljs-tag">&lt;<span class="hljs-name">mappers</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">package</span> <span class="hljs-attr">name</span> = <span class="hljs-string">&quot;com.book.dao&quot;</span>/&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">mappers</span>&gt;</span><br><br></code></pre></td></tr></table></figure>

<h3 id="Borrow实体类"><a href="#Borrow实体类" class="headerlink" title="Borrow实体类"></a>Borrow实体类</h3><p>创建borrow实体类</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//borrow实体类</span><br><span class="hljs-meta">@Data</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">Borrow</span> &#123;<br>    <span class="hljs-type">int</span> id;<br>    <span class="hljs-type">int</span> book_id;<br>    String book_name;<br>    Date time;<br>    String student_name;<br>    <span class="hljs-type">int</span> student_id;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h3 id="BookService"><a href="#BookService" class="headerlink" title="BookService"></a>BookService</h3><p>书写接口方法等待ServiceImpl去进行实现</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//bookservice</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">interface</span> <span class="hljs-title class_">BookService</span> &#123;<br><br>    List&lt;Borrow&gt; <span class="hljs-title function_">getBorrorList</span><span class="hljs-params">()</span>;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h3 id="BookServiceImpl"><a href="#BookServiceImpl" class="headerlink" title="BookServiceImpl"></a>BookServiceImpl</h3><p>ServiceImpl每实现一个方法都要先创建sqlsession数据库连接对象</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//ServiceImpl</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">BookServiceImpl</span> <span class="hljs-keyword">implements</span> <span class="hljs-title class_">BookService</span> &#123;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">public</span> List&lt;Borrow&gt; <span class="hljs-title function_">getBorrorList</span><span class="hljs-params">()</span> &#123;<br>        <span class="hljs-comment">//创建当前数据库连接对象</span><br>        <span class="hljs-keyword">try</span>(<span class="hljs-type">SqlSession</span> <span class="hljs-variable">sqlsession</span> <span class="hljs-operator">=</span> MybatisUtil.getSession())&#123;<br>            <span class="hljs-type">BookMapper</span> <span class="hljs-variable">mapper</span> <span class="hljs-operator">=</span> sqlsession.getMapper(BookMapper.class);<br>            <span class="hljs-comment">//按照mapper查询借阅信息</span><br>            <span class="hljs-keyword">return</span> mapper.getBorrowList();<br>        &#125;<br>    &#125;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h3 id="BookMapper"><a href="#BookMapper" class="headerlink" title="BookMapper"></a>BookMapper</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//BookMapper</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">interface</span> <span class="hljs-title class_">BookMapper</span> &#123;<br><br>    <span class="hljs-meta">@Results(&#123;</span><br><span class="hljs-meta">        @Result(column = &quot;id&quot;,property = &quot;id&quot;),</span><br><span class="hljs-meta">        @Result(column = &quot;bid&quot;,property = &quot;book_id&quot;),</span><br><span class="hljs-meta">        @Result(column = &quot;title&quot;,property = &quot;book_name&quot;),</span><br><span class="hljs-meta">        @Result(column = &quot;time&quot;,property = &quot;time&quot;),</span><br><span class="hljs-meta">        @Result(column = &quot;name&quot;,property = &quot;student_name&quot;),</span><br><span class="hljs-meta">        @Result(column = &quot;sid&quot;,property = &quot;student_id&quot;)</span><br><span class="hljs-meta">    &#125;)</span><br>    <span class="hljs-meta">@Select(&quot;select * from borrow,student,book where borrow.bid = book.bid and borrow.sid = student.sid&quot;)</span><br>    List&lt;Borrow&gt; <span class="hljs-title function_">getBorrowList</span><span class="hljs-params">()</span>;<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h3 id="IndexServlet"><a href="#IndexServlet" class="headerlink" title="IndexServlet"></a>IndexServlet</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebServlet(&quot;/index&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">IndexServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br>    <span class="hljs-comment">//获取借阅信息</span><br>    BookService service;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">init</span><span class="hljs-params">()</span> <span class="hljs-keyword">throws</span> ServletException &#123;<br>        service = <span class="hljs-keyword">new</span> <span class="hljs-title class_">BookServiceImpl</span>();<br>    &#125;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//设置编码</span><br>        req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>        <span class="hljs-comment">//创建一个上下文对象</span><br>        <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>        <span class="hljs-comment">//内容修改</span><br>        <span class="hljs-comment">//获取username放在页面右上角</span><br>        <span class="hljs-type">User</span> <span class="hljs-variable">user</span> <span class="hljs-operator">=</span> (User) req.getSession().getAttribute(<span class="hljs-string">&quot;user&quot;</span>);<br>        context.setVariable(<span class="hljs-string">&quot;nickname&quot;</span>,user.getNickname());<br>        <span class="hljs-comment">//借阅信息列表整个返回到前端</span><br>        context.setVariable(<span class="hljs-string">&quot;borrow_list&quot;</span>,service.getBorrorList());<br>        <span class="hljs-comment">//提交修改</span><br>        ThymeleafUtil.process(<span class="hljs-string">&quot;index.html&quot;</span>,context,resp.getWriter());<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="index-html"><a href="#index-html" class="headerlink" title="index.html"></a>index.html</h3><p>Servlet将整个列表返回给前端页面，通过前端的each循环进行对应展示</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-comment">&lt;!--前端输出--&gt;</span><br><span class="hljs-tag">&lt;<span class="hljs-name">tr</span> <span class="hljs-attr">th:each</span> = <span class="hljs-string">&quot;borrow:$&#123;borrow_list&#125;&quot;</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;&#x27;#&#x27;+$&#123;borrow.getBook_id()&#125;&quot;</span>&gt;</span>我是ID<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;$&#123;borrow.getBook_name()&#125;&quot;</span>&gt;</span>我是书名<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;$&#123;borrow.getTime()&#125;&quot;</span>&gt;</span>22/06/2021<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;$&#123;borrow.getStudent_name()&#125;&quot;</span>&gt;</span>我是借阅人<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;&#x27;#&#x27;+$&#123;borrow.getStudent_id()&#125;&quot;</span>&gt;</span>20191701<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br><br></code></pre></td></tr></table></figure>

<h2 id="归还操作"><a href="#归还操作" class="headerlink" title="归还操作"></a>归还操作</h2><h3 id="思路-1"><a href="#思路-1" class="headerlink" title="思路"></a>思路</h3><p>归还操作类似后面的删除书籍、学生操作。在点击归还按钮之后，前端带着有id的doPost请求向Servlet进行申请。Servlet将ID转化为int形式然后传到Service，Service执行mapper中定义的删除方法。</p>
<h3 id="index-html-1"><a href="#index-html-1" class="headerlink" title="index.html"></a>index.html</h3><p>点击归还操作后带着id提交申请到对应servlet</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;relative&quot;</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;action-btn &quot;</span> <span class="hljs-attr">th:href</span>=<span class="hljs-string">&quot;&#x27;return-book?id=&#x27;+$&#123;borrow.getId()&#125;&quot;</span>&gt;</span><br></code></pre></td></tr></table></figure>

<h3 id="ReturnServlet"><a href="#ReturnServlet" class="headerlink" title="ReturnServlet"></a>ReturnServlet</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@WebServlet(&quot;/return-book&quot;)</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">ReturnServlet</span> <span class="hljs-keyword">extends</span> <span class="hljs-title class_">HttpServlet</span> &#123;<br>    <span class="hljs-comment">//获取借阅信息</span><br>    BookService service;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">init</span><span class="hljs-params">()</span> <span class="hljs-keyword">throws</span> ServletException &#123;<br>        service = <span class="hljs-keyword">new</span> <span class="hljs-title class_">BookServiceImpl</span>();<br>    &#125;<br>    <span class="hljs-meta">@Override</span><br>    <span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>        <span class="hljs-comment">//设置编码</span><br>        req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>        resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>        <span class="hljs-comment">//归还的是什么记录</span><br>        <span class="hljs-type">String</span> <span class="hljs-variable">id</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;id&quot;</span>);<br>        <span class="hljs-comment">//执行归还行为</span><br>        service.returnBook(id);<br>        <span class="hljs-comment">//归还之后重定向index</span><br>        resp.sendRedirect(<span class="hljs-string">&quot;index&quot;</span>);<br><br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="BookService-1"><a href="#BookService-1" class="headerlink" title="BookService"></a>BookService</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-keyword">public</span> <span class="hljs-keyword">interface</span> <span class="hljs-title class_">BookService</span> &#123;<br>    List&lt;Borrow&gt; <span class="hljs-title function_">getBorrorList</span><span class="hljs-params">()</span>;<br>    <span class="hljs-keyword">void</span> <span class="hljs-title function_">returnBook</span><span class="hljs-params">(String id)</span>;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="BookServiceImpl-1"><a href="#BookServiceImpl-1" class="headerlink" title="BookServiceImpl"></a>BookServiceImpl</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">returnBook</span><span class="hljs-params">(String id)</span> &#123;<br>    <span class="hljs-comment">//创建当前数据库连接对象</span><br>    <span class="hljs-keyword">try</span>(<span class="hljs-type">SqlSession</span> <span class="hljs-variable">sqlsession</span> <span class="hljs-operator">=</span> MybatisUtil.getSession())&#123;<br>        <span class="hljs-type">BookMapper</span> <span class="hljs-variable">mapper</span> <span class="hljs-operator">=</span> sqlsession.getMapper(BookMapper.class);<br>        <span class="hljs-comment">//按照mapper删除借阅信息</span><br>        mapper.deleteBorrow(id);<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="BookMapper-1"><a href="#BookMapper-1" class="headerlink" title="BookMapper"></a>BookMapper</h3><figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-keyword">public</span> <span class="hljs-keyword">interface</span> <span class="hljs-title class_">BookMapper</span> &#123;<br><br>    <span class="hljs-meta">@Results(&#123;</span><br><span class="hljs-meta">            @Result(column = &quot;id&quot;,property = &quot;id&quot;),</span><br><span class="hljs-meta">            @Result(column = &quot;bid&quot;,property = &quot;book_id&quot;),</span><br><span class="hljs-meta">            @Result(column = &quot;title&quot;,property = &quot;book_name&quot;),</span><br><span class="hljs-meta">            @Result(column = &quot;time&quot;,property = &quot;time&quot;),</span><br><span class="hljs-meta">            @Result(column = &quot;name&quot;,property = &quot;student_name&quot;),</span><br><span class="hljs-meta">            @Result(column = &quot;sid&quot;,property = &quot;student_id&quot;)</span><br><span class="hljs-meta">    &#125;)</span><br>    <span class="hljs-meta">@Select(&quot;select * from borrow,student,book where borrow.bid = book.bid and borrow.sid = student.sid&quot;)</span><br>    List&lt;Borrow&gt; <span class="hljs-title function_">getBorrowList</span><span class="hljs-params">()</span>;<br><br>    <span class="hljs-meta">@Delete(&quot;delete from borrow where id = #&#123;id&#125;&quot;)</span><br>    <span class="hljs-keyword">void</span> <span class="hljs-title function_">deleteBorrow</span><span class="hljs-params">(String id)</span>;<br>&#125;<br></code></pre></td></tr></table></figure>

<h2 id="添加借阅信息"><a href="#添加借阅信息" class="headerlink" title="添加借阅信息"></a>添加借阅信息</h2><h3 id="说明"><a href="#说明" class="headerlink" title="说明"></a>说明</h3><p>发送请求进行跳转的方法：</p>
<ol>
<li><p>单个使用html链接的方式进行直接的链接跳转</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;button&quot;</span> <span class="hljs-attr">href</span>=<span class="hljs-string">&quot;add-borrow&quot;</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;btn btn-primary squer-btn sm-btn&quot;</span>&gt;</span>添加借阅信息<span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span><br></code></pre></td></tr></table></figure>
</li>
<li><p>如果是表单的话使用button（submit）+form(action和method)+name(每个属性有对应名字)</p>
</li>
</ol>
<p>添加借阅信息首先只能显示可以外借的图书，就要在列表中删除已经外借的书。为加强逻辑层的理解，我们将本应放在mapper层的图书筛选放到了Service层。</p>
<p>Get部分：我们点击href按钮进入doGet的addBorrow界面，mapper查到的是全部的书，service层将全部的书中已经借阅的部分按照id进行删除，返回剩余部分的列表返回给Servlet,前端通过select+option的each方法进行选择。学生部分逻辑相似只不过没有筛选部分相对简单。</p>
<p>Post部分：表单数据传到Servlet,Servlet将表单转换成数据。编写Mapper中的添加规则，Service浅浅实现，Impl具体实现。Servlet调用添加书籍的方法，重定向到index。</p>
<p>添加书籍和添加学生的逻辑类似，只不过要在doPost方法中进行文件编码转化。</p>
<h3 id="Get部分"><a href="#Get部分" class="headerlink" title="Get部分"></a>Get部分</h3><p>前端部分</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;form-group&quot;</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">&quot;region&quot;</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;col-form-label&quot;</span>&gt;</span>书籍<span class="hljs-tag">&lt;/<span class="hljs-name">label</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">select</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;select2 form-control&quot;</span> <span class="hljs-attr">id</span>=<span class="hljs-string">&quot;region&quot;</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;book&quot;</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">option</span> <span class="hljs-attr">th:value</span>=<span class="hljs-string">&quot;$&#123;book.getBid()&#125;&quot;</span> <span class="hljs-attr">th:each</span>=<span class="hljs-string">&quot;book : $&#123;book_list&#125;&quot;</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;$&#123;book.getTitle()&#125;&quot;</span>&gt;</span>Hawaii<span class="hljs-tag">&lt;/<span class="hljs-name">option</span>&gt;</span><br>    <span class="hljs-tag">&lt;/<span class="hljs-name">select</span>&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br></code></pre></td></tr></table></figure>

<p>Servlet部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>    <span class="hljs-comment">//设置编码</span><br>    req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>    resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>    resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>    <span class="hljs-comment">//创建一个上下文对象</span><br>    <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>    <span class="hljs-comment">//图书栏</span><br>    context.setVariable(<span class="hljs-string">&quot;book_list&quot;</span>,service.getActiveBookList());<br>    <span class="hljs-comment">//学生选择栏</span><br>    context.setVariable(<span class="hljs-string">&quot;student_list&quot;</span>,service.getStudentList());<br>    <span class="hljs-comment">//提交修改</span><br>    ThymeleafUtil.process(<span class="hljs-string">&quot;add-borrow.html&quot;</span>,context,resp.getWriter());<br><br>&#125;<br></code></pre></td></tr></table></figure>

<p>Service部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//查看过滤版本的书（borrow）</span><br>List&lt;Book&gt; <span class="hljs-title function_">getActiveBookList</span><span class="hljs-params">()</span>;<br><span class="hljs-comment">//查看借书的学生</span><br>List&lt;Student&gt; <span class="hljs-title function_">getStudentList</span><span class="hljs-params">()</span>;<br><br></code></pre></td></tr></table></figure>

<p>ServiceImpl部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//获取还能借的书</span><br><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">public</span> List&lt;Book&gt; <span class="hljs-title function_">getActiveBookList</span><span class="hljs-params">()</span> &#123;<br>    Set&lt;Integer&gt; set = <span class="hljs-keyword">new</span> <span class="hljs-title class_">HashSet</span>();<br>    <span class="hljs-built_in">this</span>.getBorrorList().forEach(borrow -&gt; set.add(borrow.getBook_id()));<br>    <span class="hljs-comment">//创建当前数据库连接对象</span><br>    <span class="hljs-keyword">try</span>(<span class="hljs-type">SqlSession</span> <span class="hljs-variable">sqlsession</span> <span class="hljs-operator">=</span> MybatisUtil.getSession())&#123;<br>        <span class="hljs-type">BookMapper</span> <span class="hljs-variable">mapper</span> <span class="hljs-operator">=</span> sqlsession.getMapper(BookMapper.class);<br>        <span class="hljs-comment">//进行已经借出的不显示</span><br>        <span class="hljs-keyword">return</span> mapper.getBookList()<br>                    .stream()<br>                    .filter(book -&gt; !set.contains(book.getBid()))<br>                    .collect(Collectors.toList());<br>    &#125;<br>&#125;<br><span class="hljs-comment">//获取全部学生信息</span><br><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">public</span> List&lt;Student&gt; <span class="hljs-title function_">getStudentList</span><span class="hljs-params">()</span> &#123;<br>    <span class="hljs-comment">//创建当前数据库连接对象</span><br>    <span class="hljs-keyword">try</span>(<span class="hljs-type">SqlSession</span> <span class="hljs-variable">sqlsession</span> <span class="hljs-operator">=</span> MybatisUtil.getSession())&#123;<br>        <span class="hljs-type">BookMapper</span> <span class="hljs-variable">mapper</span> <span class="hljs-operator">=</span> sqlsession.getMapper(BookMapper.class);<br>        <span class="hljs-comment">//得到全部的学生信息</span><br>        <span class="hljs-keyword">return</span> mapper.getStudentList();<br>    &#125;<br>&#125;<br><br><br></code></pre></td></tr></table></figure>

<p>mapper部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//获取全部图书</span><br><span class="hljs-meta">@Select(&quot;select * from book&quot;)</span><br>List&lt;Book&gt; <span class="hljs-title function_">getBookList</span><span class="hljs-params">()</span>;<br><br><span class="hljs-comment">//获取全部学生</span><br><span class="hljs-meta">@Select(&quot;select * from student&quot;)</span><br>List&lt;Student&gt; <span class="hljs-title function_">getStudentList</span><span class="hljs-params">()</span>;<br><br></code></pre></td></tr></table></figure>

<h3 id="Post部分"><a href="#Post部分" class="headerlink" title="Post部分"></a>Post部分</h3><p>前端部分的name,form和button的配置每一项都缺一不可</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">form</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;separate-form&quot;</span> <span class="hljs-attr">method</span>=<span class="hljs-string">&quot;post&quot;</span> <span class="hljs-attr">action</span>=<span class="hljs-string">&quot;add-borrow&quot;</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12&quot;</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">hr</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;mt-4 mb-4&quot;</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">h5</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;from-title mb-1&quot;</span>&gt;</span>信息选择<span class="hljs-tag">&lt;/<span class="hljs-name">h5</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;row&quot;</span>&gt;</span><br>            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12&quot;</span>&gt;</span><br>                <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;form-group&quot;</span>&gt;</span><br>                    <span class="hljs-tag">&lt;<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">&quot;region&quot;</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;col-form-label&quot;</span>&gt;</span>书籍<span class="hljs-tag">&lt;/<span class="hljs-name">label</span>&gt;</span><br>                    <span class="hljs-tag">&lt;<span class="hljs-name">select</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;select2 form-control&quot;</span> <span class="hljs-attr">id</span>=<span class="hljs-string">&quot;region&quot;</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;book&quot;</span>&gt;</span><br>                        <span class="hljs-tag">&lt;<span class="hljs-name">option</span> <span class="hljs-attr">th:value</span>=<span class="hljs-string">&quot;$&#123;book.getBid()&#125;&quot;</span> <span class="hljs-attr">th:each</span>=<span class="hljs-string">&quot;book : $&#123;book_list&#125;&quot;</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;$&#123;book.getTitle()&#125;&quot;</span>&gt;</span>Hawaii<span class="hljs-tag">&lt;/<span class="hljs-name">option</span>&gt;</span><br>                    <span class="hljs-tag">&lt;/<span class="hljs-name">select</span>&gt;</span><br>                <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br>            <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br>            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12&quot;</span>&gt;</span><br>                <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;form-group&quot;</span>&gt;</span><br>                    <span class="hljs-tag">&lt;<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">&quot;city&quot;</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;col-form-label&quot;</span>&gt;</span>学生<span class="hljs-tag">&lt;/<span class="hljs-name">label</span>&gt;</span><br>                    <span class="hljs-tag">&lt;<span class="hljs-name">select</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;select2 form-control&quot;</span> <span class="hljs-attr">id</span>=<span class="hljs-string">&quot;city&quot;</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;student&quot;</span>&gt;</span><br>                        <span class="hljs-tag">&lt;<span class="hljs-name">option</span> <span class="hljs-attr">th:value</span>=<span class="hljs-string">&quot;$&#123;student.getSid()&#125;&quot;</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;$&#123;student.getName()&#125;&quot;</span> <span class="hljs-attr">th:each</span>=<span class="hljs-string">&quot;student : $&#123;student_list&#125;&quot;</span>&gt;</span>Alaska<span class="hljs-tag">&lt;/<span class="hljs-name">option</span>&gt;</span><br>                    <span class="hljs-tag">&lt;/<span class="hljs-name">select</span>&gt;</span><br>                <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br>            <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br>        <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;form-group mb-0&quot;</span>&gt;</span><br>            <span class="hljs-tag">&lt;<span class="hljs-name">button</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;btn btn-primary&quot;</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;submit&quot;</span>&gt;</span>提交<span class="hljs-tag">&lt;/<span class="hljs-name">button</span>&gt;</span><br>        <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br>    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">form</span>&gt;</span><br></code></pre></td></tr></table></figure>

<p>Servlet部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doPost</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>    <span class="hljs-comment">//获取表单中的数据</span><br>    <span class="hljs-type">int</span> <span class="hljs-variable">sid</span> <span class="hljs-operator">=</span> Integer.parseInt(req.getParameter(<span class="hljs-string">&quot;student&quot;</span>));<br>    <span class="hljs-type">int</span> <span class="hljs-variable">bid</span> <span class="hljs-operator">=</span> Integer.parseInt(req.getParameter(<span class="hljs-string">&quot;book&quot;</span>));<br>    <span class="hljs-comment">//调用service对mapper的实现</span><br>    service.addBorrow(sid,bid);<br>    resp.sendRedirect(<span class="hljs-string">&quot;index&quot;</span>);<br>&#125;<br></code></pre></td></tr></table></figure>

<p>Service部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//借书</span><br><span class="hljs-keyword">void</span> <span class="hljs-title function_">addBorrow</span><span class="hljs-params">(<span class="hljs-type">int</span> sid,<span class="hljs-type">int</span> bid)</span>;<br></code></pre></td></tr></table></figure>

<p>ServiceImpl部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//添加借阅信息</span><br><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">addBorrow</span><span class="hljs-params">(<span class="hljs-type">int</span> sid, <span class="hljs-type">int</span> bid)</span> &#123;<br>    <span class="hljs-comment">//创建当前数据库连接对象</span><br>    <span class="hljs-keyword">try</span>(<span class="hljs-type">SqlSession</span> <span class="hljs-variable">sqlsession</span> <span class="hljs-operator">=</span> MybatisUtil.getSession())&#123;<br>        <span class="hljs-type">BookMapper</span> <span class="hljs-variable">mapper</span> <span class="hljs-operator">=</span> sqlsession.getMapper(BookMapper.class);<br>        mapper.addBorrow(sid, bid);<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<p>mapper部分</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//添加借阅信息</span><br><span class="hljs-meta">@Insert(&quot;insert into borrow(sid,bid,time) values(#&#123;sid&#125;,#&#123;bid&#125;,NOW())&quot;)</span><br><span class="hljs-keyword">void</span> <span class="hljs-title function_">addBorrow</span><span class="hljs-params">(<span class="hljs-meta">@Param(&quot;sid&quot;)</span><span class="hljs-type">int</span> sid,<span class="hljs-meta">@Param(&quot;bid&quot;)</span><span class="hljs-type">int</span> bid)</span>;<br></code></pre></td></tr></table></figure>

<h2 id="书籍页面"><a href="#书籍页面" class="headerlink" title="书籍页面"></a>书籍页面</h2><h3 id="思路-2"><a href="#思路-2" class="headerlink" title="思路"></a>思路</h3><p>书籍页面主要进行的操作有显示书籍（查询列表），添加书籍和删除书籍。</p>
<p>添加书籍和前面的添加借阅信息类似，只不过针对要手动输入汉字，汉字再传入Servlet的情况，我们要在doPost方法中加入编码调整。前端是按钮转到链接，提交表单，Servlet,调用Service方法,Service调用mapper进行查询。</p>
<p>删除书籍也是点击按钮进行链接操作，删除之后再进行重定向。</p>
<p>主要进行的就是查询书籍操作，查询书籍要显示书籍的借阅状态，</p>
<h3 id="显示书籍（doGet）"><a href="#显示书籍（doGet）" class="headerlink" title="显示书籍（doGet）"></a>显示书籍（doGet）</h3><p>Html（对书籍的状态进行了if选择语句）</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br></pre></td><td class="code"><pre><code class="hljs html"><span class="hljs-tag">&lt;<span class="hljs-name">thead</span>&gt;</span><br><span class="hljs-tag">&lt;<span class="hljs-name">tr</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">th</span>&gt;</span>书籍ID<span class="hljs-tag">&lt;/<span class="hljs-name">th</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">th</span>&gt;</span>书籍标题<span class="hljs-tag">&lt;/<span class="hljs-name">th</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">th</span>&gt;</span>书籍简介<span class="hljs-tag">&lt;/<span class="hljs-name">th</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">th</span>&gt;</span>书籍价格<span class="hljs-tag">&lt;/<span class="hljs-name">th</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">th</span>&gt;</span>借阅状态<span class="hljs-tag">&lt;/<span class="hljs-name">th</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">th</span>&gt;</span>删除书籍<span class="hljs-tag">&lt;/<span class="hljs-name">th</span>&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">tr</span>&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">thead</span>&gt;</span><br><span class="hljs-tag">&lt;<span class="hljs-name">tbody</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">tr</span> <span class="hljs-attr">th:each</span>=<span class="hljs-string">&quot;book,iterStat: $&#123;book_list&#125;&quot;</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;&#x27;#&#x27;+$&#123;book.getBid&#125;&quot;</span>&gt;</span>#JH2033<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;&#x27;《&#x27;+$&#123;book.getTitle()&#125;+&#x27;》&#x27;&quot;</span>&gt;</span>#JH2033<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;$&#123;book.getDesc()&#125;&quot;</span>&gt;</span>22/06/2021<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">th:text</span>=<span class="hljs-string">&quot;&#x27;￥&#x27;+$&#123;book.getPrice()&#125;&quot;</span>&gt;</span>$600<span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">label</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;mb-0 badge badge-primary&quot;</span> <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;&quot;</span> <span class="hljs-attr">data-original-title</span>=<span class="hljs-string">&quot;Pending&quot;</span> <span class="hljs-attr">th:if</span>=<span class="hljs-string">&quot;$&#123;book_list_status.get(iterStat.index)&#125;&quot;</span>&gt;</span>正在借阅<span class="hljs-tag">&lt;/<span class="hljs-name">label</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">label</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;mb-0 badge badge-success&quot;</span> <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;&quot;</span> <span class="hljs-attr">data-original-title</span>=<span class="hljs-string">&quot;Pending&quot;</span> <span class="hljs-attr">th:unless</span>=<span class="hljs-string">&quot;$&#123;book_list_status.get(iterStat.index)&#125;&quot;</span>&gt;</span>可借阅<span class="hljs-tag">&lt;/<span class="hljs-name">label</span>&gt;</span><br>    <span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br>    <span class="hljs-tag">&lt;<span class="hljs-name">td</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;relative&quot;</span>&gt;</span><br>        <span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;action-btn &quot;</span> <span class="hljs-attr">th:href</span>=<span class="hljs-string">&quot;&#x27;delete-book?bid=&#x27;+$&#123;book.getBid()&#125;&quot;</span>&gt;</span><br>            <span class="hljs-tag">&lt;<span class="hljs-name">svg</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;default-size &quot;</span> <span class="hljs-attr">viewBox</span>=<span class="hljs-string">&quot;0 0 341.333 341.333 &quot;</span>&gt;</span><br>                <span class="hljs-tag">&lt;<span class="hljs-name">g</span>&gt;</span><br>                    <span class="hljs-tag">&lt;<span class="hljs-name">g</span>&gt;</span><br>                        <span class="hljs-tag">&lt;<span class="hljs-name">g</span>&gt;</span><br>                            <span class="hljs-tag">&lt;<span class="hljs-name">path</span> <span class="hljs-attr">d</span>=<span class="hljs-string">&quot;M170.667,85.333c23.573,0,42.667-19.093,42.667-42.667C213.333,19.093,194.24,0,170.667,0S128,19.093,128,42.667 C128,66.24,147.093,85.333,170.667,85.333z &quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">path</span>&gt;</span><br>                            <span class="hljs-tag">&lt;<span class="hljs-name">path</span> <span class="hljs-attr">d</span>=<span class="hljs-string">&quot;M170.667,128C147.093,128,128,147.093,128,170.667s19.093,42.667,42.667,42.667s42.667-19.093,42.667-42.667 S194.24,128,170.667,128z &quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">path</span>&gt;</span><br>                            <span class="hljs-tag">&lt;<span class="hljs-name">path</span> <span class="hljs-attr">d</span>=<span class="hljs-string">&quot;M170.667,256C147.093,256,128,275.093,128,298.667c0,23.573,19.093,42.667,42.667,42.667s42.667-19.093,42.667-42.667 C213.333,275.093,194.24,256,170.667,256z &quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">path</span>&gt;</span><br>                        <span class="hljs-tag">&lt;/<span class="hljs-name">g</span>&gt;</span><br>                    <span class="hljs-tag">&lt;/<span class="hljs-name">g</span>&gt;</span><br>                <span class="hljs-tag">&lt;/<span class="hljs-name">g</span>&gt;</span><br>            <span class="hljs-tag">&lt;/<span class="hljs-name">svg</span>&gt;</span><br>        <span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span><br>    <span class="hljs-tag">&lt;/<span class="hljs-name">td</span>&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">tr</span>&gt;</span><br><span class="hljs-tag">&lt;/<span class="hljs-name">tbody</span>&gt;</span><br></code></pre></td></tr></table></figure>

<p>Servlet</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//获取借阅信息</span><br>BookService service;<br><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">init</span><span class="hljs-params">()</span> <span class="hljs-keyword">throws</span> ServletException &#123;<br>    service = <span class="hljs-keyword">new</span> <span class="hljs-title class_">BookServiceImpl</span>();<br>&#125;<br><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doGet</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>    <span class="hljs-comment">//设置编码</span><br>    req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>    resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>    resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>    <span class="hljs-comment">//创建一个上下文对象</span><br>    <span class="hljs-type">Context</span> <span class="hljs-variable">context</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Context</span>();<br>    <span class="hljs-comment">//获取username</span><br>    <span class="hljs-type">User</span> <span class="hljs-variable">user</span> <span class="hljs-operator">=</span> (User) req.getSession().getAttribute(<span class="hljs-string">&quot;user&quot;</span>);<br>    context.setVariable(<span class="hljs-string">&quot;nickname&quot;</span>,user.getNickname());<br>    <span class="hljs-comment">//获取书籍信息</span><br>    context.setVariable(<span class="hljs-string">&quot;book_list&quot;</span>,service.getBookList().keySet());<br>    context.setVariable(<span class="hljs-string">&quot;book_list_status&quot;</span>,<span class="hljs-keyword">new</span> <span class="hljs-title class_">ArrayList</span>&lt;&gt;(service.getBookList().values()));<br>    <span class="hljs-comment">//提交修改</span><br>    ThymeleafUtil.process(<span class="hljs-string">&quot;books.html&quot;</span>,context,resp.getWriter());<br>&#125;<br></code></pre></td></tr></table></figure>

<p>Service</p>
<p>在定义时key代表列表，value代表是否借阅中，所以，进而传到Servlet中时可以直接使用。</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//获取书籍信息</span><br>context.setVariable(<span class="hljs-string">&quot;book_list&quot;</span>,service.getBookList().keySet());<br><span class="hljs-comment">//获取书籍状态</span><br>context.setVariable(<span class="hljs-string">&quot;book_list_status&quot;</span>,<span class="hljs-keyword">new</span> <span class="hljs-title class_">ArrayList</span>&lt;&gt;(service.getBookList().values()));<br></code></pre></td></tr></table></figure>

<p>ServiceImpl</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//获取全部书籍（要看借阅状态的）</span><br><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">public</span> Map&lt;Book, Boolean&gt; <span class="hljs-title function_">getBookList</span><span class="hljs-params">()</span> &#123;<br>    Set&lt;Integer&gt; set = <span class="hljs-keyword">new</span> <span class="hljs-title class_">HashSet</span>();<br>    <span class="hljs-built_in">this</span>.getBorrorList().forEach(borrow -&gt; set.add(borrow.getBook_id()));<br>    <span class="hljs-comment">//创建当前数据库连接对象</span><br>    <span class="hljs-keyword">try</span>(<span class="hljs-type">SqlSession</span> <span class="hljs-variable">sqlsession</span> <span class="hljs-operator">=</span> MybatisUtil.getSession())&#123;<br>        Map&lt;Book,Boolean&gt; map = <span class="hljs-keyword">new</span> <span class="hljs-title class_">LinkedHashMap</span>&lt;&gt;();<br>        <span class="hljs-type">BookMapper</span> <span class="hljs-variable">mapper</span> <span class="hljs-operator">=</span> sqlsession.getMapper(BookMapper.class);<br>        mapper.getBookList().forEach(book -&gt;map.put(book, set.contains(book.getBid())));<br>        <span class="hljs-keyword">return</span> map;<br>    &#125;<br>&#125;<br></code></pre></td></tr></table></figure>

<h3 id="添加书籍-doPost"><a href="#添加书籍-doPost" class="headerlink" title="添加书籍(doPost)"></a>添加书籍(doPost)</h3><p>往常请求页面都是在Servlet-doGet中进行代码修改，之前再添加选择信息是也是传递的是英文字母为Value，添加书籍和学生都应该在doPost中进行代码修改，才能使前端页面传到服务器的值是正确的UTF-8（在项目代码编码中设置全局项目和本项目都是UTF-8）</p>
<p><img src="/image/22.07.06/image_SrB_3dX8LH.png" srcset="/img/loading.gif" lazyload></p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-meta">@Override</span><br><span class="hljs-keyword">protected</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">doPost</span><span class="hljs-params">(HttpServletRequest req, HttpServletResponse resp)</span> <span class="hljs-keyword">throws</span> ServletException, IOException &#123;<br>    <span class="hljs-comment">//设置输入的编码</span><br>    req.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>    resp.setCharacterEncoding(<span class="hljs-string">&quot;utf-8&quot;</span>);<br>    resp.setContentType(<span class="hljs-string">&quot;text/html;charset=utf-8&quot;</span>);<br>    <span class="hljs-comment">//取得前端表单</span><br>    <span class="hljs-type">String</span> <span class="hljs-variable">title</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;title&quot;</span>);<br>    <span class="hljs-type">String</span> <span class="hljs-variable">desc</span> <span class="hljs-operator">=</span> req.getParameter(<span class="hljs-string">&quot;desc&quot;</span>);<br>    <span class="hljs-type">double</span> <span class="hljs-variable">price</span> <span class="hljs-operator">=</span> Double.parseDouble(req.getParameter(<span class="hljs-string">&quot;price&quot;</span>));<br>    <span class="hljs-comment">//System.out.println(title+desc+price);</span><br>    service.addBook(title,desc,price);<br>    resp.sendRedirect(<span class="hljs-string">&quot;books&quot;</span>);<br>&#125;<br><br></code></pre></td></tr></table></figure>

<h2 id="“记住我”功能的实现"><a href="#“记住我”功能的实现" class="headerlink" title="“记住我”功能的实现"></a>“记住我”功能的实现</h2><p>如果登陆成功，就把用户的信息扔给Cookie</p>
<p>（创建Cookie，添加Cookie，设置时间，进行重定向）</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">// 如果true则重定向到index</span><br><span class="hljs-keyword">if</span> (service.auth(username, password, req.getSession())) &#123;<br>    <span class="hljs-comment">//记住我+doGet</span><br>    <span class="hljs-keyword">if</span> (remember != <span class="hljs-literal">null</span>) &#123;<br><br>        <span class="hljs-type">Cookie</span> <span class="hljs-variable">cookie_username</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Cookie</span>(<span class="hljs-string">&quot;username&quot;</span>, username);<br>        cookie_username.setMaxAge(<span class="hljs-number">60</span> * <span class="hljs-number">60</span> * <span class="hljs-number">24</span> * <span class="hljs-number">7</span>);<br>        <span class="hljs-type">Cookie</span> <span class="hljs-variable">cookie_password</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Cookie</span>(<span class="hljs-string">&quot;password&quot;</span>, password);<br>        cookie_password.setMaxAge(<span class="hljs-number">60</span> * <span class="hljs-number">60</span> * <span class="hljs-number">24</span> * <span class="hljs-number">7</span>);<br>        <span class="hljs-comment">//给回响的Cookie加上数据</span><br>        resp.addCookie(cookie_username);<br>        resp.addCookie(cookie_password);<br>    &#125;<br>    resp.sendRedirect(<span class="hljs-string">&quot;index&quot;</span>);<br>&#125;<br><span class="hljs-comment">//如果false则滚去重新进行登陆页面</span><br><span class="hljs-keyword">else</span> &#123;<br>    req.getSession().setAttribute(<span class="hljs-string">&quot;login-failure&quot;</span>, <span class="hljs-keyword">new</span> <span class="hljs-title class_">Object</span>());<br>    <span class="hljs-built_in">this</span>.doGet(req, resp);<br>&#125;<br></code></pre></td></tr></table></figure>

<blockquote>
<p>问题：退出时又自动登录</p>
<p>解决：原因是退出到主页时，原来的Cookie还在，所以会默认登陆。所以我们要在LogoutServlet操作中加入清除Cookie</p>
<figure class="highlight java"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><code class="hljs java"><span class="hljs-comment">//清除Cookie</span><br><span class="hljs-type">Cookie</span> <span class="hljs-variable">cookie_username</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Cookie</span>(<span class="hljs-string">&quot;username&quot;</span>, <span class="hljs-string">&quot;username&quot;</span>);<br>cookie_username.setMaxAge(<span class="hljs-number">0</span>);<br><span class="hljs-type">Cookie</span> <span class="hljs-variable">cookie_password</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Cookie</span>(<span class="hljs-string">&quot;password&quot;</span>, <span class="hljs-string">&quot;password&quot;</span>);<br>cookie_password.setMaxAge(<span class="hljs-number">0</span>);<br><span class="hljs-comment">//给回响的Cookie加上数据</span><br>resp.addCookie(cookie_username);<br>resp.addCookie(cookie_password);<br></code></pre></td></tr></table></figure>
</blockquote>
<blockquote>
<p>问题：项目中分别设置Cookie与Session，开始和结束两个操作的关系。</p>
<p>答：Session的作用时让注册过的用户可以访问所有的页面。Cookie的作用是让用户在下一次打开网页时可以直接免登录。</p>
<p>虽然说本地的服务器写一个“记住我”的功能没有大的必要，但是如果布置到网上，就会显得很有用，比如每次登录Github都会默认登陆。</p>
<p>Cookie和Session有相似点，可他们的功能互不干扰。</p>
</blockquote>

              
            </div>
            <hr/>
            <div>
              <div class="post-metas my-3">
  
    <div class="post-meta mr-3 d-flex align-items-center">
      <i class="iconfont icon-category"></i>
      

<span class="category-chains">
  
  
    
      <span class="category-chain">
        
  <a href="/categories/%E5%BC%80%E5%8F%91/" class="category-chain-item">开发</a>
  
  

      </span>
    
  
</span>

    </div>
  
  
    <div class="post-meta">
      <i class="iconfont icon-tags"></i>
      
        <a href="/tags/Java/">#Java</a>
      
        <a href="/tags/%E5%AE%9E%E6%88%98/">#实战</a>
      
    </div>
  
</div>


              
  

  <div class="license-box my-3">
    <div class="license-title">
      <div>基于Java Web的图书管理系统</div>
      <div>http://example.com/2022/07/06/JavaWeb/</div>
    </div>
    <div class="license-meta">
      
        <div class="license-meta-item">
          <div>作者</div>
          <div>Wahoyu</div>
        </div>
      
      
        <div class="license-meta-item license-meta-date">
          <div>发布于</div>
          <div>2022年7月6日</div>
        </div>
      
      
      <div class="license-meta-item">
        <div>许可协议</div>
        <div>
          
            
            
              <a target="_blank" href="https://creativecommons.org/licenses/by/4.0/">
              <span class="hint--top hint--rounded" aria-label="BY - 署名">
                <i class="iconfont icon-by"></i>
              </span>
              </a>
            
          
        </div>
      </div>
    </div>
    <div class="license-icon iconfont"></div>
  </div>



              
                <div class="post-prevnext my-3">
                  <article class="post-prev col-6">
                    
                    
                      <a href="/2022/07/26/BookManagerSSM/" title="基于SSM+Security的图书管理系统">
                        <i class="iconfont icon-arrowleft"></i>
                        <span class="hidden-mobile">基于SSM+Security的图书管理系统</span>
                        <span class="visible-mobile">上一篇</span>
                      </a>
                    
                  </article>
                  <article class="post-next col-6">
                    
                    
                      <a href="/2022/06/27/%E5%9F%BA%E4%BA%8EMybatis-JUL-Lombok-Maven%E7%9A%84%E5%9B%BE%E4%B9%A6%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F%EF%BC%88%E5%B8%A6%E5%8D%95%E5%85%83%E6%B5%8B%E8%AF%95%EF%BC%89/" title="基于Mybatis的图书管理系统">
                        <span class="hidden-mobile">基于Mybatis的图书管理系统</span>
                        <span class="visible-mobile">下一篇</span>
                        <i class="iconfont icon-arrowright"></i>
                      </a>
                    
                  </article>
                </div>
              
            </div>

            
  <article id="comments" lazyload>
    
  <div id="valine"></div>
  <script type="text/javascript">
    Fluid.utils.loadComments('#valine', function() {
      Fluid.utils.createScript('https://lib.baomitu.com/valine/1.4.16/Valine.min.js', function() {
        var options = Object.assign(
          {"appId":"7WuaJQGQGU5GFxMKMtDzWYVI-gzGzoHsz","appKey":"zdCzx5CuURztPQQoi8LuXSWv","path":"window.location.pathname","placeholder":"请留下您的想法...","avatar":"retro","meta":["nick","mail","link"],"requiredFields":[],"pageSize":10,"lang":"zh-CN","highlight":false,"recordIP":true,"serverURLs":"https://7wuajqgq.lc-cn-n1-shared.com","emojiCDN":null,"emojiMaps":null,"enableQQ":true},
          {
            el: "#valine",
            path: window.location.pathname
          }
        )
        new Valine(options);
        Fluid.utils.waitElementVisible('#valine .vcontent', () => {
          var imgSelector = '#valine .vcontent img:not(.vemoji)';
          Fluid.plugins.imageCaption(imgSelector);
          Fluid.plugins.fancyBox(imgSelector);
        })
      });
    });
  </script>
  <noscript>Please enable JavaScript to view the comments</noscript>


  </article>


          </article>
        </div>
      </div>
    </div>

    <div class="side-col d-none d-lg-block col-lg-2">
      
  <aside class="sidebar" style="margin-left: -1rem">
    <div id="toc">
  <p class="toc-header"><i class="iconfont icon-list"></i>&nbsp;目录</p>
  <div class="toc-body" id="toc-body"></div>
</div>



  </aside>


    </div>
  </div>
</div>





  



  



  



  



  






    

    
      <a id="scroll-top-button" aria-label="TOP" href="#" role="button">
        <i class="iconfont icon-arrowup" aria-hidden="true"></i>
      </a>
    

    
      <div class="modal fade" id="modalSearch" tabindex="-1" role="dialog" aria-labelledby="ModalLabel"
     aria-hidden="true">
  <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header text-center">
        <h4 class="modal-title w-100 font-weight-bold">搜索</h4>
        <button type="button" id="local-search-close" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body mx-3">
        <div class="md-form mb-5">
          <input type="text" id="local-search-input" class="form-control validate">
          <label data-error="x" data-success="v" for="local-search-input">关键词</label>
        </div>
        <div class="list-group" id="local-search-result"></div>
      </div>
    </div>
  </div>
</div>

    

    
  </main>

  <footer>
    <div class="footer-inner">
  
    <div class="footer-content">
       <a href="https://hexo.io" target="_blank" rel="nofollow noopener"><span>Hexo</span></a> <i class="iconfont icon-love"></i> <text>哆啦是个梦</text> <div style="font-size: 0.85rem"> <span id="timeDate">载入天数...</span> <span id="times">载入时分秒...</span> <script src="/js/duration.js"></script> </div> 
    </div>
  
  
  
  
</div>

  </footer>

  <!-- Scripts -->
  
  <script  src="https://lib.baomitu.com/nprogress/0.2.0/nprogress.min.js" ></script>
  <link  rel="stylesheet" href="https://lib.baomitu.com/nprogress/0.2.0/nprogress.min.css" />

  <script>
    NProgress.configure({"showSpinner":false,"trickleSpeed":100})
    NProgress.start()
    window.addEventListener('load', function() {
      NProgress.done();
    })
  </script>


<script  src="https://lib.baomitu.com/jquery/3.6.0/jquery.min.js" ></script>
<script  src="https://lib.baomitu.com/twitter-bootstrap/4.6.1/js/bootstrap.min.js" ></script>
<script  src="/js/events.js" ></script>
<script  src="/js/plugins.js" ></script>


  <script  src="https://lib.baomitu.com/typed.js/2.0.12/typed.min.js" ></script>
  <script>
    (function (window, document) {
      var typing = Fluid.plugins.typing;
      var subtitle = document.getElementById('subtitle');
      if (!subtitle || !typing) {
        return;
      }
      var text = subtitle.getAttribute('data-typed-text');
      
        typing(text);
      
    })(window, document);
  </script>




  

  

  

  

  

  

  




  
    <script  src="/js/img-lazyload.js" ></script>
  




  
<script>
  Fluid.utils.createScript('https://lib.baomitu.com/tocbot/4.18.0/tocbot.min.js', function() {
    var toc = jQuery('#toc');
    if (toc.length === 0 || !window.tocbot) { return; }
    var boardCtn = jQuery('#board-ctn');
    var boardTop = boardCtn.offset().top;

    window.tocbot.init({
      tocSelector     : '#toc-body',
      contentSelector : '.markdown-body',
      headingSelector : CONFIG.toc.headingSelector || 'h1,h2,h3,h4,h5,h6',
      linkClass       : 'tocbot-link',
      activeLinkClass : 'tocbot-active-link',
      listClass       : 'tocbot-list',
      isCollapsedClass: 'tocbot-is-collapsed',
      collapsibleClass: 'tocbot-is-collapsible',
      collapseDepth   : CONFIG.toc.collapseDepth || 0,
      scrollSmooth    : true,
      headingsOffset  : -boardTop
    });
    if (toc.find('.toc-list-item').length > 0) {
      toc.css('visibility', 'visible');
    }
  });
</script>


  <script>
  (function() {
    var enableLang = CONFIG.code_language.enable && CONFIG.code_language.default;
    var enableCopy = CONFIG.copy_btn;
    if (!enableLang && !enableCopy) {
      return;
    }

    function getBgClass(ele) {
      return Fluid.utils.getBackgroundLightness(ele) >= 0 ? 'code-widget-light' : 'code-widget-dark';
    }

    var copyTmpl = '';
    copyTmpl += '<div class="code-widget">';
    copyTmpl += 'LANG';
    copyTmpl += '</div>';
    jQuery('.markdown-body pre').each(function() {
      var $pre = jQuery(this);
      if ($pre.find('code.mermaid').length > 0) {
        return;
      }
      if ($pre.find('span.line').length > 0) {
        return;
      }

      var lang = '';

      if (enableLang) {
        lang = CONFIG.code_language.default;
        if ($pre[0].children.length > 0 && $pre[0].children[0].classList.length >= 2 && $pre.children().hasClass('hljs')) {
          lang = $pre[0].children[0].classList[1];
        } else if ($pre[0].getAttribute('data-language')) {
          lang = $pre[0].getAttribute('data-language');
        } else if ($pre.parent().hasClass('sourceCode') && $pre[0].children.length > 0 && $pre[0].children[0].classList.length >= 2) {
          lang = $pre[0].children[0].classList[1];
          $pre.parent().addClass('code-wrapper');
        } else if ($pre.parent().hasClass('markdown-body') && $pre[0].classList.length === 0) {
          $pre.wrap('<div class="code-wrapper"></div>');
        }
        lang = lang.toUpperCase().replace('NONE', CONFIG.code_language.default);
      }
      $pre.append(copyTmpl.replace('LANG', lang).replace('code-widget">',
        getBgClass($pre[0]) + (enableCopy ? ' code-widget copy-btn" data-clipboard-snippet><i class="iconfont icon-copy"></i>' : ' code-widget">')));

      if (enableCopy) {
        Fluid.utils.createScript('https://lib.baomitu.com/clipboard.js/2.0.10/clipboard.min.js', function() {
          var clipboard = new window.ClipboardJS('.copy-btn', {
            target: function(trigger) {
              var nodes = trigger.parentNode.childNodes;
              for (var i = 0; i < nodes.length; i++) {
                if (nodes[i].tagName === 'CODE') {
                  return nodes[i];
                }
              }
            }
          });
          clipboard.on('success', function(e) {
            e.clearSelection();
            e.trigger.innerHTML = e.trigger.innerHTML.replace('icon-copy', 'icon-success');
            setTimeout(function() {
              e.trigger.innerHTML = e.trigger.innerHTML.replace('icon-success', 'icon-copy');
            }, 2000);
          });
        });
      }
    });
  })();
</script>


  
<script>
  Fluid.utils.createScript('https://lib.baomitu.com/anchor-js/4.3.1/anchor.min.js', function() {
    window.anchors.options = {
      placement: CONFIG.anchorjs.placement,
      visible  : CONFIG.anchorjs.visible
    };
    if (CONFIG.anchorjs.icon) {
      window.anchors.options.icon = CONFIG.anchorjs.icon;
    }
    var el = (CONFIG.anchorjs.element || 'h1,h2,h3,h4,h5,h6').split(',');
    var res = [];
    for (var item of el) {
      res.push('.markdown-body > ' + item.trim());
    }
    if (CONFIG.anchorjs.placement === 'left') {
      window.anchors.options.class = 'anchorjs-link-left';
    }
    window.anchors.add(res.join(', '));
  });
</script>


  
<script>
  Fluid.utils.createScript('https://lib.baomitu.com/fancybox/3.5.7/jquery.fancybox.min.js', function() {
    Fluid.plugins.fancyBox();
  });
</script>


  <script>Fluid.plugins.imageCaption();</script>

  <script  src="/js/local-search.js" ></script>

  <script defer src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" ></script>




  
<script src="//cdn.jsdelivr.net/gh/bynotes/texiao/source/js/xiantiao.js"></script>



<!-- 主题的启动项，将它保持在最底部 -->
<!-- the boot of the theme, keep it at the bottom -->
<script  src="/js/boot.js" ></script>


  

  <noscript>
    <div class="noscript-warning">博客在允许 JavaScript 运行的环境下浏览效果更佳</div>
  </noscript>
</body>
</html>
